import React, { useEffect, useRef } from 'react';
import { Card, Flex } from 'antd';
import styles from './index.module.scss';

const FooterBar = ({ children }) => {
    const fullRef = useRef();
    useEffect(() => {
        fullRef.current.parentElement.style.position = 'relative';
        fullRef.current.parentElement.style.height = '100%';
    }, []);
    return (
        <>
            <div ref={fullRef} style={{ height: 56 }} />
            <Card className={styles.footer}>
                <Flex justify="flex-end" gap={20}>
                    {children}
                </Flex>
            </Card>
        </>
    );
};

export default FooterBar;
